const { resolve } = require('path')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const CssMiniMizerPlugin = require('css-minimizer-webpack-plugin')

module.exports = {
    mode: 'production',
    entry: './src/index.js',
    output: {
        clean: true,
        path: resolve(__dirname, 'dist'),
        filename: 'js/[name]-bundle.js',
        assetModuleFilename: 'images/[name][ext]',
        environment: {
            arrowFunction: false
        }
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader']
            },
            {
                test: /\.less$/,
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', 'less-loader']
            },
            {
                test: /\.s[ac]ss$/,
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', 'sass-loader']
            },
            {
                test:/\.(png|jpg|jpeg|gif)$/,
                type:'asset/resource'
            },
            {
                test:/\.js$/,
                exclude:/node_modules/,
                use:'babel-loader'
            }
        ]
    },
    plugins:[
		new MiniCssExtractPlugin({
			filename:'style/[name].css'
		}),
		new CssMiniMizerPlugin()
	]
}